﻿@{
    ViewBag.Title = "Index";
    Layout = "~/Areas/Admin/Views/Shared/_Layout.cshtml";
}
@model TaoPortal.Areas.Admin.Models.ProductModel
<ul class="breadcrumb" style="margin-bottom: 7px;">
    <li><a href="#">首页</a> <span class="divider">/</span></li>
    <li><a href="#">内容管理</a> <span class="divider">/</span></li>
    <li class="active">产品管理</li>
</ul>
<div class="row-fluid">
    <div class="span6">
        <div class="panel">
            <div class="panel-header clearfix">
                <h3 class="pull-left">产品分类</h3>
                <div class="pull-right" id="tbar">
                    <ul class="bui-bar button-group" id="bar8" role="toolbar" aria-disabled="false">
                    </ul>
                </div>
            </div>
            <div class="panel-body" id="ArtTree">
            </div>
        </div>
    </div>
    <div class="span18">
        <div class="panel">
            <div class="panel-header clearfix">
                <h3 class="pull-left">产品列表</h3>
                <div class="pull-right">
                    <button id="addArticleBtn" class="button button-small button-primary">添加产品</button>
                </div>
            </div>
            <div class="panel-body" id="grid">
                <form tabindex="0" class="form-horizontal" id="searchForm">
                    @Html.HiddenFor(x => x.Searcher.PClass)
                    <table style="width: 100%; margin-bottom: 5px;">
                        <tr>
                            <td>产品型号：</td>
                            <td>@Html.TextBoxFor(x => x.Searcher.PModel, new { @class = "input-small" })</td>
                            <td>产品名称：</td>
                            <td>@Html.TextBoxFor(x => x.Searcher.PName, new { @class = "input-small" })</td>
                            <td>产品状态：</td>
                            <td>@Html.TextBoxFor(x => x.Searcher.Status, new { @class = "input-small" })</td>
                        </tr>
                        <tr>
                            <td>创建日期：</td>
                            <td>@Html.TextBoxFor(x => x.Searcher.StartTime, new { @class = "input-small" })-@Html.TextBoxFor(x => x.Searcher.EndTime, new { @class = "input-small" })</td>
                            <td>其他属性：</td>
                            <td>@Html.TextBoxFor(x => x.Searcher.OtherName, new { @class = "input-small" })-@Html.TextBoxFor(x => x.Searcher.OtherValue, new { @class = "input-small" })</td>
                            <td colspan="2">
                                <button class="button button-small" id="btnSearch" type="submit">搜索</button>
                            </td>
                        </tr>
                    </table>
                </form>
            </div>
        </div>
    </div>
</div>
<script type="text/javascript">
    var Overlay = BUI.Overlay
    var dialog = null;
    var tree = null;
    //日期控件
    BUI.use('bui/calendar', function (Calendar) {
        var datepicker = new Calendar.DatePicker({
            trigger: '.calendar',
            maxDate: '2014-01-01',
            minDate: '2013-7-25',
            autoRender: true
        });
    });
    function AddClass() {
        //var selected = tree.getSelected();
        //if (selected == null) {
        //    alert('请选择父级分类！');
        //    return false;
        //}
        dialog = new Overlay.Dialog({
            title: '产品管理->添加分类',
            width: 580,
            closeAction: 'destroy',
            height: 335,
            buttons: [],
            bodyStyle: { 'padding': '0px' },
            bodyContent: '<iframe frameborder="0" style="width:570px;height:273px" src="/Admin/Product/AddClass"></iframe>'
        });
        dialog.show();
    }
    function EditClass() {
        var selected = tree.getSelected();
        if (selected == null) {
            alert('请选择分类！');
            return false;
        }
        dialog = new Overlay.Dialog({
            title: '产品管理->编辑分类',
            width: 900,
            closeAction: 'destroy',
            height: 500,
            buttons: [],
            bodyStyle: { 'padding': '0px' },
            bodyContent: '<iframe frameborder="0" style="width:570px;height:273px" src="/Admin/Product/EditClass?id=' + selected.id + '"></iframe>'
        });
        dialog.show();
    }
    function CloseWin() {
        dialog.close();
        location.reload();
    }
    function DelClass() {
        var selected = tree.getSelected();
        if (selected == null) {
            alert('请选择分类！');
            return false;
        }
        if (confirm('确认删除？')) {
            $.ajax({
                type: 'post',
                url: '/Admin/Product/DeleteClass',
                data: { id: selected.id },
                success: function (res) {
                    location.reload();
                }
            });
        }
    }
    function SubmitSuccess() {
        //alert('提交成功！');
        dialog.close();
        location.reload();
    }
    function EditProd(id) {
        top.topManager.openPage({
            id: 'EditArticlePage',
            reload: true,
            href: '/Admin/Product/EditProduct/' + id,
            title: '编辑产品'
        });
    }
    function DeleteProd(id) {
        if (confirm('确认删除？')) {
            $.ajax({
                type: 'post',
                url: '/Admin/Product/Delete',
                data: { id: id },
                success: function (res) {
                    if (res == 'true') {
                        $('#btnSearch').trigger('click');
                    }
                }
            })
        }
    }
    var Toolbar = BUI.Toolbar;
    var g3 = new Toolbar.Bar({
        elCls: 'button-group',
        multipleSelect: true,
        defaultChildCfg: {
            elCls: 'button button-small',
            selectable: true //允许选中
        },
        children: [
          { content: '<i class="icon icon-plus"></i>', id: 'addBtn', handler: AddClass, elAttrs: { title: '增加' } },
          { content: '<i class="icon icon-edit"></i>', id: 'editBtn', handler: EditClass, elAttrs: { title: '编辑' } },
          { content: '<i class="icon icon-remove"></i>', id: 'delBtn', handler: DelClass, elAttrs: { title: '删除' } }
        ],
        render: '#tbar'
    });
    g3.render();



    //g3.on('click', function (e) {
    //    var id = e.target.get('id');
    //    switch (id) {
    //        case '':

    //        default:

    //    }
    //});

    $('#addArticleBtn').click(function () {
        location.href = "/Admin/Product/AddProduct";
    })


    //文章分类
    BUI.use(['bui/tree', 'bui/data'], function (Tree, Data) {
        //数据缓冲类
        var store = new Data.TreeStore({
            //root: {
            //    id: null,
            //    text: 'root',
            //    checked: false
            //},
            url: '/Admin/Product/AjaxGetClass',
            autoLoad: true
        });

        tree = new Tree.TreeList({
            render: '#ArtTree',
            showLine: true,
            height: 300,
            store: store
        });
        tree.render();

        //树节点数据，
        //text : 文本，
        //id : 节点的id,
        //leaf ：标示是否叶子节点，可以不提供，根据childern,是否为空判断
        //expanded ： 是否默认展开
        //var data = [
        //    { text: '审核通过', id: '1', expanded: true, children: [{ text: '国内新闻', id: '11' }, { text: '国际新闻', id: '22' }] },
        //    { text: '未审核', id: '2' }
        //];
@*        var data = eval('@Html.Raw(Model.ProductClass)');
        //由于这个树，不显示根节点，所以可以不指定根节点
        tree = new Tree.TreeList({
            render: '#ArtTree',
            showLine: true,
            //dirSelectable: false,//阻止树节点选中
            nodes: data
        });
        tree.render();*@
        //store.reloadNode(node);
        tree.on('itemclick', function (ev) {
            if (!ev.item.id)
                return false;
            $('#Searcher_PClass').val(ev.item.id);
            $('#btnSearch').trigger('click');
        });
    });




    //列表
    var Grid = BUI.Grid,
    Store = BUI.Data.Store,
    columns = [
      { title: '产品型号', width: 100, sortable: false, dataIndex: 'PModel' },
      { title: '产品名称', width: 400, sortable: false, dataIndex: 'PName' },
      { title: '创建时间', width: 150, sortable: false, dataIndex: 'CreateTime' },
      { title: '状态', width: 80, sortable: false, dataIndex: 'Status' },
      {
          title: '操作', width: 80, sortable: false, dataIndex: 'ID',
          renderer: function (value, obj) {
              return '<span class="grid-command" onclick="EditProd(\'' + value + '\')">编辑</span><span class="grid-command" onclick="DeleteProd(\'' + value + '\')" >删除</span>';
          }
      }
    ];
    //加载列表
    var store = new Store({
        url: '/Admin/Product/AjaxGetList',
        proxy: {
            limitParam: 'pageSize',
            method: 'post'
        },
        autoLoad: true,
        pageSize: 10
    }),
    grid = new Grid.Grid({
        render: '#grid',
        loadMask: true,
        forceFit: true,
        plugins: [Grid.Plugins.AutoFit],
        columns: columns,
        store: store,
        bbar: {
            pagingBar: true
        }
    });
    grid.render();
    //搜索
    var form = $('#searchForm')[0];
    $(form).on('submit', function (ev) {
        ev.preventDefault();
        var obj = BUI.FormHelper.serializeToObject(form);
        obj.pageIndex = 0;
        obj.start = 0;
        store.load(obj);
    });

</script>
